<html>
<head>
<link href="cirnoplayer.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="jquery.jplayer.min.js"></script>
<script src="cirnoplayer.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$.cirnoplayer({
			resourceUrl : ".",
			onUpdate : function(data, status) {
				console.log("onUpdate");
				console.log(data);
				console.log(status);
			}
		});
	});
</script>
</head>
<body>
	<a href="sample1.mp3" title="sample1">Sample1!!</a>
	<a href="sample2.mp3" title="sample2">Sample2!!</a>
	<a href="sample3.mp3" title="sample3">Sample3!!</a>
	<div>
		<h2>Status</h2>
		<div>
			<a class="cirnoplayer-status-link"><span
				class="cirnoplayer-status-name"></span></a>
		</div>
		<div class="cirnoplayer-status"></div>
		<p>
			<a href="javascript:$.cirnoplayer('prev')">prev</a> <a
				href="javascript:$.cirnoplayer('play')">play</a> <a
				href="javascript:$.cirnoplayer('next')">next</a>
		</p>
		<p>
			<a href="javascript:$.cirnoplayer('stop')">stop</a> 
			<a href="javascript:$.cirnoplayer('reset')">reset</a>
		</p>
	</div>
	<div id="cirnoplayer"></div>
</body>
</html>